<template>
  <div class="priceBase">
    <div class="SJdiv2">
      <span
        style="
          font-size: 25px;
          font-family: Source Han Sans CN;
          font-weight: bold;
          color: #051232;
          line-height: 84px;
          margin-left: 10px;
        "
        >报价设置</span
      >
    </div>
    <!-- <div style="float: right; margin-right: 242px">
      <el-button type="primary" style="width: 104px" @click="gengx"
        >更新</el-button
      >
    </div> -->
    <div>
      <el-form
        :model="formaprice"
        ref="formaprice"
        label-width="100px"
        style="margin-left: 70px"
      >
        <el-form-item label="交易开关:" style="width: 350px">
          <el-switch
            v-model="formaprice.transactionSwitch"
            class="captcha-img"
            active-color="#13ce66"
            inactive-color="#ff4949"
            active-value="1"
            inactive-value="0"
            @click.native="kaiqi(formaprice.transactionSwitch)"
          ></el-switch>
          <span v-if="formaprice.transactionSwitch == 0">关闭</span>
          <span v-if="formaprice.transactionSwitch == 1">开启中</span>
        </el-form-item>
        <el-form-item label="交易时间" style="width: 550px">
          <el-col :span="11">
            <!-- <el-time-select
              placeholder="起始时间"
              v-model="formaprice.transactionStartTime"
              :picker-options="{
                start: '08:30',
                step: '00:15',
                end: '24:00',
              }"
            >
            </el-time-select> -->
            <el-time-picker
              v-model="formaprice.transactionStartTime"
              :picker-options="{
                selectableRange: '',
              }"
              placeholder="起始时间"
            >
            </el-time-picker>
          </el-col>
          <el-col class="line" :span="2">——</el-col>
          <el-col :span="11">
            <!-- <el-time-select
              placeholder="结束时间"
              v-model="formaprice.transactionEndTime"
              :picker-options="{
                start: '08:30',
                step: '00:15',
                end: '24:00',
                minTime: formaprice.transactionStartTime,
              }"
            >
            </el-time-select> -->
            <el-time-picker
              arrow-control
              v-model="formaprice.transactionEndTime"
              :picker-options="{
                selectableRange: '',
              }"
              placeholder="任意时间点"
            >
            </el-time-picker>
          </el-col>
          <el-col :span="11">
            <el-checkbox
              v-model="formaprice.holidaySwitch"
              true-label="1"
              false-label="0"
              @change="guanbi"
              >关闭节假日?</el-checkbox
            >
          </el-col>
        </el-form-item>
        <el-form-item label="单笔限额:">
          <el-select
            v-model="formaprice.perLimit"
            placeholder="请选择"
            style="width: 220px"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.label"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="当前报价:">
          <el-upload
            ref="upfile"
            style="display: inline"
            :on-change="handleChange"
            :file-list="fileList"
            :action="11111"
            :before-upload="UploadUrl"
          >
            <el-button size="small" type="primary">点击上传</el-button> -->
        <!-- <div slot="tip" class="el-upload__tip">
              只能上传jpg/png文件，且不超过500kb
            </div> -->
        <!-- </el-upload>
          <div class="xiaz"> -->
        <!-- <el-button type="primary" plain @click="downloadFile"
              >下载模板</el-button
            > -->
        <!-- <a
              href="http://192.168.20.61:8888/group1/M00/00/02/wKgUPWDujCyANa5aAAAoWhpEi5k99.xlsx"
              download="文件.docx"
              class="xiazzz"
              >下载模板</a
            >
            <span>更新时间:{{ formaprice.updateTime }}</span>
          </div>
        </el-form-item> -->
      </el-form>
    </div>
    <!-- <div class="tabe">
      <el-table :data="tableData" style="width: 100%" max-height="250">
        <el-table-column prop="bankClassification" label="银行分类" width="150">
        </el-table-column>
        <el-table-column prop="bankName" label="银行名称" width="120">
        </el-table-column>
        <el-table-column prop="billMoney" label="票面金融(万元)" width="120">
        </el-table-column>
        <el-table-column prop="billTerm" label="期限" width="120">
        </el-table-column>
        <el-table-column prop="flaw" label="有无瑕疵(瑕疵类型)" width="120">
        </el-table-column>
        <el-table-column prop="endorseTimes" label="背书次数" width="120">
        </el-table-column>
        <el-table-column
          prop="isReqContract"
          label="是否需要合同/发票"
          width="120"
        >
        </el-table-column>
        <el-table-column prop="billInterest" label="价格" width="120">
        </el-table-column>
      </el-table>
    </div> -->
  </div>
</template>
<script>
import {
  getReqDetailLatest,
  updateHolidaySwitch,
  setHolidaySwitch,
  uploadReqFile,
  setPriceBaseInfo,
} from "@/api/leagues/app";
import { dateFormat } from "@/utils/date";
export default {
  data() {
    return {
      formaprice: {
        // transactionSwitch: "",
        transactionStartTime: "",
        transactionEndTime: "",
        perLimit: "",
        updateTime: "",
        holidaySwitch: 0,
      },
      options: [
        {
          value: "0",
          label: "0~50",
        },
        {
          value: "1",
          label: "50~100",
        },
        {
          value: "2",
          label: "100~500",
        },
        {
          value: "3",
          label: "500~1000",
        },
        {
          value: "4",
          label: "1000以上",
        },
        {
          value: "5",
          label: "不限",
        },
      ],
      name: "",
      value: "",
      fileList: [],
      tableData: [],
    };
  },
  mounted() {
    this.listbj();
  },
  methods: {
    onSubmit() {
      console.log("submit!");
    },
    handleChange(file, fileList) {
      this.fileList = fileList.slice(-3);
    },
    //  UploadUrl: function () {

    //   return "返回需要上传的地址";
    // },
    UploadUrl() {
      let fd = new FormData();
      this.fileList.forEach((item) => {
        //文件信息中raw才是真的文件
        fd.append("file", item.raw);
        //console.log(item.raw)
      });
      uploadReqFile(fd).then((res) => {
        if (res.data.code === 0) {
          //console.log(res);
          this.$message(res.data.msg);
          this.listbj();
        } else {
          this.$message(res.data.msg);
        }
      });
      return false; //屏蔽了action的默认上传
    },

    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    listbj() {
      var that = this;
      getReqDetailLatest().then((data) => {
        this.tableData = data.data.data.innerReqDetailLatestVOList;
        this.formaprice.transactionEndTime = data.data.data.transactionEndTime;
        this.formaprice.transactionStartTime =
          data.data.data.transactionStartTime;
        this.formaprice.updateTime = data.data.data.updateTime;
        this.formaprice.transactionSwitch = data.data.data.transactionSwitch;
        this.formaprice.holidaySwitch = data.data.data.holidaySwitch;
        this.formaprice.perLimit = data.data.data.perLimit;
        this.formaprice.bankId = data.data.data.bankId;
        // that.$message({
        //   duration: 600,
        //   message: "查询成功",
        //   type: "success",
        // });
      });
    },
    kaiqi(value) {
      const h = this.$createElement;
      if (value == 0) {
        this.$confirm(
          "此操作将${!value ? '开启' : '关闭'}验证, 是否继续",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
            message: h("div", null, [
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "关闭交易开关后, "
              ),
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "您将不再交易时段内发出报价,"
              ),
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "平台也将不再继续为您推荐询价,"
              ),
            ]),
          }
        )
          .then(() => {
            debugger;
            updateHolidaySwitch(this.formaprice).then((data) => {
              console.log(this.formaprice, "this.formaprice222");
              if (data.data.code == "1") {
                this.$message({
                  duration: 600,
                  message: data.data.msg,
                  type: "success",
                });
              } else if (data.data.msg == "0") {
                this.formaprice.transactionSwitch =
                  this.formaprice.transactionSwitch === "0" ? "1" : "0";
                this.$message({
                  duration: 600,
                  message: data.data.msg,
                  type: "warning",
                });
              }
            });
          })
          .catch((res) => {
            this.$message({
              duration: 600,
              type: "info",
              message: res.data.msg,
            });
          });
      } else if (value == 1) {
        this.$confirm(
          "此操作将${!value ? '开启' : '关闭'}验证, 是否继续",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
            message: h("div", null, [
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "开启交易开关后, "
              ),
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "您将在交易时段内发出报价,"
              ),
              h(
                "div",
                {
                  style:
                    "color: #051232;font-size: 16px;width: 299px;height: 27px;line-height: 15px;text-align: center;",
                },
                "平台也将继续为您推荐询价,"
              ),
            ]),
          }
        )
          .then(() => {
            updateHolidaySwitch(this.formaprice).then((data) => {
              console.log(this.formaprice, "this.formaprice3333");
              if (data.data.code == 0) {
                this.$message({
                  duration: 600,
                  message: data.data.msg,
                  type: "success",
                });
              } else if (data.data.code == 1) {
                this.formaprice.transactionSwitch =
                  this.formaprice.transactionSwitch === "0" ? "1" : "0";
                this.$message({
                  duration: 600,
                  message: data.data.msg,
                  type: "warning",
                });
              }
            });
          })
          .catch((res) => {
            this.$message({
              duration: 600,
              type: "info",
              message: res.data.msg,
            });
          });
      }
    },
    guanbi(value) {
      this.formaprice.transactionStartTime = dateFormat(
        this.formaprice.transactionStartTime,
        "YYYY-MM-DD HH:mm:ss"
      );
      this.formaprice.transactionEndTime = dateFormat(
        this.formaprice.transactionEndTime,
        "YYYY-MM-DD HH:mm:ss"
      );
      this.$confirm("是否确定在节假日关闭报价？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
      })

        .then(() => {
          console.log(this.formaprice, "this.formapricesssss");
          setHolidaySwitch(this.formaprice).then((data) => {
            if (data.data.code == 1) {
              this.$message({
                duration: 600,
                message: data.data.msg,
              });
            } else if (data.data.code == 0) {
              // console.log(
              //   this.formaprice.holidaySwitch,
              //   "this.formaprice.holidaySwitch"
              // );
              this.formaprice.holidaySwitch = value;
              // this.$message({
              //   duration: 600,
              //   message: data.data.msg,
              // });
            }
          });
        })
        .catch((res) => {
          this.$message({
            type: "info",
            duration: 600,
            message: res.data.msg,
          });
        });
    },

    gengx() {
      var that = this;
      that.$refs.formaprice.validate((valid) => {
        if (valid) {
          setPriceBaseInfo(Object.assign(this.formaprice)).then((data) => {
            if (data.data.code == 0) {
              that.$message.success("修改成功");
            } else if (data.data.code == 1) {
              that.$message.success(data.data.msg);
            }
            that.listbj();
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
  },
};
</script>
<style scoped>
.priceBase {
  width: 1200px;
  height: 850px;
  background: #ffffff;
  /* box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.06); */
  border-radius: 6px 6px 10px 10px;
  margin: 0 auto;
  position: relative;
  top: 50%;
}
>>> .el-switch.is-checked .el-switch__core {
  border-color: #15be6b;
  background-color: #15be6b;
}
>>> .el-upload__input {
  display: none;
}
>>> .el-upload-list {
  width: 425px;
}
.xiazzz {
  width: 88px !important;
  height: 30px !important;
  background: #ffffff;
  border: 1px solid #0075ff;
  border-radius: 6px;
  font-size: 16px;
}
.xiaz {
  float: right;
  margin-right: 303px;
  margin-top: -47px;
}
.xiaz span {
  width: 121px;
  height: 13px;
  font-size: 13px;
  font-family: PingFang SC;
  font-weight: 400;
  color: #818ea8;
  line-height: 1px;
}
.tabe {
  width: 915px;
  height: 304px;
  background: #ffffff;
  border: 1px solid #bdc3ca;
  border-radius: 4px;
  margin-left: 70px;
}

>>> .el-table--fit {
  max-height: 345px !important;
}
>>> .el-table--scrollable-y .el-table__body-wrapper {
  max-height: 229px !important;
}
</style>
